(function () {
  'use strict';

  CKEDITOR.plugins.add('letterspacing', {
    requires: ['richcombo'],
    lang: 'en,zh-cn',
    init: function (editor) {
      var config = editor.config,
      trackings = [];

      config.allowedContent = 'span';

      for (var i = -10; i < 21; i++) {
        trackings.push(String(i) + 'px');
      }

      editor.ui.addRichCombo('letterspacing', {
        label: editor.lang.letterspacing.title,
        title: editor.lang.letterspacing.title,
        voiceLabel: editor.lang.letterspacing.title,

        panel: {
          css: [CKEDITOR.skin.getPath('editor')].concat(config.contentsCss),
          multiSelect: false,
          attributes: { 'aria-label': editor.lang.letterspacing.title }
        },

        init: function () {
          this.startGroup(editor.lang.letterspacing.title);
          for (var this_letting in trackings) {
            this.add(trackings[this_letting], trackings[this_letting], trackings[this_letting]);
          }
        },

        onClick: function (value) {
          editor.focus();
          editor.fire('saveSnapshot');
          var ep = editor.elementPath();
          var style = new CKEDITOR.style({ styles: { 'letter-spacing': value } });
          editor[style.checkActive(ep) ? 'removeStyle' : 'applyStyle'](style);

          editor.fire('saveSnapshot');
        }
      });
    }
  });
})();
